<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>第三方上传资质</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="assets/layui/css/layui.css">
	<link rel="stylesheet" href="assets/css/all.css" />
	<!--<link rel="stylesheet" href="assets/css/uploadimg.css" />-->
</head>
<body>
	<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
	<!--[if lt IE 9]>
		  <script src="assets/js/html5.min.js"></script>
		  <script src="assets/js/respond.min.js"></script>
		<![endif]-->
	<div class="layui-container">
		<form class="layui-form" action="" onsubmit="return false;">
			<div class="layui-form-item carInforWrap">			
				<div class="car-img">
					<div class="layui-upload imgupload layui-clear">
						<button type="button" class="layui-btn" id="edit-up-btn"></button>
						<blockquote class="layui-elem-quote layui-quote-nm layui-clear" style="border:none">图片上传:(<span style="color: red;">点击图片可将其删除,文件类型jpg、png、bmp、jpeg,大小不超过2M</span>)
							<div class="layui-upload-list" id="pics-wrap">
								 <span class="add-bg">+</span>
							</div>
						</blockquote>
					</div>
				</div>
			</div>
			<div style="text-align: center;margin:20px auto;">
				<button class="layui-btn" lay-submit lay-filter="car-submit-btn">提  交</button>
			</div>
		</form>
	</div>

	<script src="assets/layui/layui.js"></script>
	<script type="text/javascript" src="assets/js/all.js"></script>
	<script>
		layui.use(["form","element",'layer','upload'],function(){
			var form = layui.form,
				layer = layui.layer,
				upload = layui.upload,
				$ = layui.$
				//编辑发布汽车拍卖信息的页面js
				//多图上传
				upload.render({
					elem: '#edit-up-btn',
					url: '/upload/',
					multiple: true,
					size: 1024 * 2,
					number: 0,
					before: function(obj) {
						//预读本地文件示例，不支持ie8
						obj.preview(function(index, file, result) {
							$('.edit-car-infor #pics-wrap').append('<img src="' + result + '" alt="' + file.name + '" class="layui-upload-img">');
							
						});
					},
					done: function(res) {
						//上传完毕
						if(res.result == 0) {
							layer.msg(res.message);
							
							//点击删除图片
							$(".edit-car-infor").delegate(".imgupload blockquote img", "click", function() {
								
								//alert(file.name);
								var theImg = $(this);
								layer.confirm("确定删除此张图片吗？", function(index) {
									$.ajax({
										type:"post",
										url:"upload?name="+ file.name,
										success:function(){
											theImg.remove();
										}										
									});									
									layer.close(index);
								})
							})
						} else {
							layer.msg("文件:" + res.filename + "---" + res.message);
						}
					},error:function(index,upload){
				    	layer.msg("服务器返回错误！");
				    	layer.closeAll('loading');
				    	
				    }
				});
				//点击删除图片
//				$(".edit-car-infor").delegate(".imgupload blockquote img", "click", function() {
//					var theImg = $(this);
//					alert(file.name);
//					layer.confirm("确定删除此张图片吗？", function(index) {
////						$.ajax({
////							type:"post",
////							url:"upload?name"+ file.name,
////							
////						});
//						theImg.remove();
//						layer.close(index);
//					})
//				})
			
			//监听提交
			form.on('submit(car-submit-btn)', function(data) {
//				layer.alert(JSON.stringify(data.field), {
//	                time:5000,
//	                title: "最终的提交信息"
//	            });
				$.ajax({
					type:"post",
					url:"",
					data:data.field,
					dataType:"json",
					success:function(){
						layer.alert(JSON.stringify(data.result),{
	                        time:5000,
	                        title:"成功"
	                   })
					},
					error: function(jqXHP,textStatus,errorThrown){
	                    layer.alert(jqXHP.responseText);
	                }
				});
				return false;
			});
			
		})
	</script>
</body>
</html>
